
(function () {
    fetch('http://chst.vip:1234/api/getbrandtitle').then((res) => {
        // console.log(typeof res.json())
        return res.json()
    }).then(res => {
        // console.log(res.result)
        let str = ''
        res.result.forEach(item => {
            // console.log(item)
            str += `
                <li brandTitleId=${item.brandTitleId}>
                    <div class="items_title">
                        <span>${item.brandTitle}</span>
                        <span class="iconfont icon-xiala"></span>
                    </div>
                    <ul class="items_bottom">

                    </ul>
                </li>

                `

        })
        $('.items').html(str)


        $('.items').html(str)

    }).then(() => {
        console.log($('.items li'))
        let arr = $('.items li')
        // console.log(typeof arr)
        // console.log(arr['0'])
        //    console.log(arr.length)
        for (let i = 0; i < arr.length; i++) {
            // console.log(arr[i])
            // console.log($(arr[i]).attr('brandTitleId'))
            fetch(`http://chst.vip:1234/api/getbrand?brandtitleid=${$(arr[i]).attr('brandTitleId')}`).then(res => {
                return res.json()
            }).then(res => {
                let str = ''
                // console.log(res.result)
                res.result.forEach(item => {
                    str += `
                    <li brandTitleId1=${item.brandTitleId} name=${item.brandName}>
                        <a href="javascript:;" brandTitleId1=${item.brandTitleId} name=${item.brandName}>
                            <div class="w_top" brandTitleId1=${item.brandTitleId} name=${item.brandName}>
                                <span>${item.brandId}</span>
                                <p>${item.brandName}</p>
                            </div>
                            <div class="w_bottom" brandTitleId1=${item.brandTitleId} name=${item.brandName}>
                                <span>${item.brandInfo}</span>
                            </div>           
                        </a>
                    </li>
                    `
                })
                $(arr[i]).find('.items_bottom').html(str)
            })
        }

        let flag = true
        $('.items_bottom').slideUp(0)


        $('.items_title').click(function () {
            if (flag) {
                $(this).next().slideDown(0).parent().siblings().find('.items_bottom').slideUp(0)
                flag = false
            } else {
                $('.items_bottom').slideUp(0)
                flag = true
            }


        })
    })

    // 点击跳转
    $('.items').click(function (e) {
        // console.log(e.target.parentNode.nodeName)
        console.log(e.target.parentNode.getAttribute('brandTitleId1'))
        let id = e.target.parentNode.getAttribute('brandTitleId1')
        let name = e.target.parentNode.getAttribute('name')
        if (id == null) return
        location.href = `../pages/WholeParticulars.html?brandTitleId=${id}&name=${name}`


    })


})()